<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="../css/order.css" />
	<style type="text/css">
		.mui-pull-top-pocket{
			top: 40px;
		}
		.orderHead{
			position: relative;
			z-index: 100;
		}
	</style>
</head>
<body class="gray">
	<div class="mui-content">
	    <div class="mui-row orderHeadAll">
			<div class="active" data-type="11"><span>待付款</span></div>
			<div class="" data-type="3"><span>待完工</span></div>
			<div class="" data-type="4"><span>待评论</span></div>
			<div class="" data-type="5"><span>退款订单</span></div>
			<div class="" data-type="0"><span>全部</span></div>
		</div>	
	</div>
<script src="../js/mui.min.js"></script>
<script src="../js/bexta.js"></script>
<script type="text/javascript">
	var views, suvView;
	mui.init({
		beforeback:function(){
				mui.fire(plus.webview.getWebviewById('center'), 'updateOrderStatus');
			}
	});
	mui.plusReady(function () {
		views = bexta.getWebview();
		var offsetTop = '40px';
	    if( mui.os.android ){
	    		offsetTop = 87 + bexta.getStatusHeight() + 'px'; 
	    }
	    subView = mui.preload({
	    		id:'order',
	    		url:'order.html',
	    		styles:{
	    			top:offsetTop,
	    			bottom:'0'
	    		},
	    		extras:{
	    			orderType:views.orderType
	    		}
	    });
	    views.append(subView);
	    
	    //tab
	    mui('.orderHeadAll').on('tap', 'div', function(){
	    		document.querySelector('.orderHeadAll div.active').classList.remove('active');
	    		this.classList.add('active');
	    		var otype = this.getAttribute('data-type');
	    		mui.fire(subView, 'toggleTab', {
	    			typed:otype
	    		});
	    });
	});
</script>
</body>
</html>